<template>
  <el-form class="add-event-timer">
    <dropdown-normal label="计时类型" :valLists="TIMER_TYPES" v-model="wbData.type" @change="onUpdateWbComponent"></dropdown-normal>
    <el-form-item label="开始时间" v-if="wbData.type == TIMER_TYPES_MAP.countdownTime">
      <el-date-picker v-model="wbData.time" type="datetime" placeholder="选择日期时间" @change="onUpdateWbComponent"></el-date-picker>
    </el-form-item>
    <el-form-item label="截止时间" v-else-if="wbData.type == TIMER_TYPES_MAP.positiveTime">
      <el-date-picker v-model="wbData.time" type="datetime" placeholder="选择日期时间" @change="onUpdateWbComponent"></el-date-picker>
    </el-form-item>
    <el-form-item label="倒计时时间(秒数)" v-else-if="wbData.type == TIMER_TYPES_MAP.activityCountdownTime || wbData.type == TIMER_TYPES_MAP.countdown">
      <!-- <el-date-picker v-model="wbData.time" type="datetime" placeholder="选择日期时间" @change="onUpdateWbComponent"></el-date-picker> -->
      <input-normal v-model="wbData.countdown" @change="onUpdateWbComponent"></input-normal>
    </el-form-item>
    <el-form-item label="开始截止时间" v-else-if="wbData.type == TIMER_TYPES_MAP.activityStartEndTime">
      <el-date-picker v-model="wbData.time" type="datetime" placeholder="选择日期时间" @change="onUpdateWbComponent"></el-date-picker>
      <el-date-picker v-model="wbData.endTime" type="datetime" placeholder="选择日期时间" @change="onUpdateWbComponent"></el-date-picker>
    </el-form-item>
    <dropdown-normal label="结束动作" :valLists="pushPops()" v-model="wbData.popId" @change="onUpdateWbComponent"></dropdown-normal>
  </el-form>
</template>
<script setup lang="ts">
import { useWebControlsStore } from '@/store/web/controls'
import { pushPops } from '@/views/ts/'
import { TIMER_TYPES, TIMER_TYPES_MAP } from '@/const/'

const props = defineProps<{ 
  event: IEvent,
  index: number,
}>()

const event = props.event
const useWebControls = useWebControlsStore()

const  activeNames = [1]
let wbData_: any
const wbData = computed(() => {
  try {
    wbData_ = useWebControls.currentControls![event.controlId] && useWebControls.currentControls![event.controlId].data
  } catch (error) {
    console.log("controlData.data null")
  }
  return wbData_
})
const onUpdateWbComponent = () => {
  useWebControls.updateWbComponent({ controlId: event.controlId, data: wbData_ })
}
</script>
